<template>
	<view v-if="pageReady">
		<view class="product-window" :class="(attr.cartAttr === true ? 'on' : '')" :style="(iScart ? 'padding-bottom:30rpx;' : bottomLift==0?'padding-bottom:140rpx':'padding-bottom:200rpx')" @touchmove.stop.prevent="">
			<view class="textpic acea-row row-between-wrapper">
				<view class="pictrue">
					<image :src="attr.productSelect.image" mode="aspectFill" class="morenGoodsBG"></image>
				</view>
				<view class="text">
					<view class="line1">{{ attr.productSelect.storeName }}</view>
					<view class="money font-color">
						<text class="num" v-if="!isShengDanOK">
							<block v-if="appletType==1">
								{{$util.ipMoney(attr.productSelect.price).type + ($util.ipMoney(attr.productSelect.price).num+$util.ipMoney(attr.productSelect.taxAndSecondPrice).num)}}
							</block>
							<block v-else>
								{{$util.ipMoney(attr.productSelect.price).type + $util.ipMoney(attr.productSelect.price).num}}
							</block>
						</text>
						<text class="num" v-if="isShengDanOK">&euro;1</text>
						<text class="stock">库存: {{ attr.productSelect.stock }}</text>
						<!-- <text class='stock'>限量: {{attr.productSelect.quota_show}}</text> -->
					</view>
				</view>
				<view class="iconfont iconzhifushibai1" @click="closeAttr"></view>
			</view>
			<view class="productWinList">
				<scroll-view scroll-y style="max-height: 394rpx;">
					<view class="item" v-for="(item, indexw) in attr.productNewAttr" :key="indexw">
						<view class="title">{{ item.attrName }}</view>
						<view class="listn acea-row row-middle">
							<!-- <view class="itemn" :class="item.index === itemn.attr ? 'on' : ''" v-for="(itemn, indexn) in item.attrValue" @click="tapAttr(indexw, indexn,item,itemn)" :key="indexn">{{ itemn.attr }}</view> -->
							<block v-if="item.attrName=='颜色'">
								<view class="itemn on" v-for="(itemn, indexn) in item.attrValue" :key="indexn">{{ itemn.attr }}</view>
							</block>
							<block v-else>
								<view class="itemn" :class="indexItem === itemn.value.id ? 'on' : ''" v-for="(itemn, indexn) in item.attrValue" @click="tapAttr(indexw, indexn,item,itemn)" :key="indexn">{{ itemn.attr }}</view>
							</block>
						</view>
					</view>
				</scroll-view>
			</view>
			<view class="cart flex3" v-if="!isShengDanOK">
				<view class="title">数量</view>
				<view class="carnum acea-row row-left">
					<view class="item reduce" :class="attr.productSelect.cart_num <= 1 ? 'on' : ''" @click="ChangeCartNum(false)">
						<text class="iconfont iconjianhao"></text>
					</view>
					<view class='item num'>
					    <input type="number" maxlength="5" data-name="productSelect.cart_num" :value="attr.productSelect.cart_num" @input="bindCode"></input>
					</view>
					<view class='item plus' :class='(attr.productSelect.cart_num >= attr.productSelect.quota_show) || (attr.productSelect.cart_num >= attr.productSelect.stock)? "on":""' @click='ChangeCartNum(true)'>+</view>
				</view>
			</view>
			<view v-if="iScart">
				<view class="joinBnt on" v-if="!attr.productSelect.stock || !attr.productAttr || attr.productAttr.length == 0">已售罄</view>
				<view class="joinBnt bg-color" v-else @click="reGoCat">确定</view>
			</view>
			
		</view>
		<view class="product-con" v-if="!iScart">
			<view class='footer acea-row row-between-wrapper' :class="bottomLift!=0?'bottomLift':''"
			:style="[{ left:(attr.cartAttr || isShowFooterBtn) ? '0' : '750'+ 'rpx', padding: (!systemType||attr.cartAttr)?'0 20rpx 0 30rpx' : '0 100rpx' , paddingBottom: `${bottomLift}px`}]">
			
				<!-- #ifdef MP-WEIXIN -->
				<downLoadImg :goods="{id:storeInfo.id}" :configApi.sync="configApi">
					<text slot="cont" class="downLoadImg">
						<text class="iconfont iconxiazai9"></text>
						<text class="txt">下载</text>
					</text>
				</downLoadImg>
				<!-- #endif -->
				<!-- <view @click="setCollect" class='item'>
					<view class='iconfont iconshoucang-tianchong' v-if="storeInfo.userCollect"></view>
					<view class='iconfont iconshoucang' v-else></view>
					<view>收藏</view>
				</view> -->
				<view @click="showWxFun" class='item'>
					<view class="iconfont iconkefu1"></view>
					<view>客服</view>
				</view>
				<view class="animated item" :class="animated==true?'bounceIn':''" @click="goCartPage">
					<view class='iconfont icongouwudai'>
						<text class='num' v-show="CartCount && CartCount > 0">{{CartCount || 0}}</text>
					</view>
					<view>购物袋</view>
				</view>
				<block v-if="!systemType">
					<view class='bnt acea-row' :style="{justifyContent: isShengDanOK ? 'center' : '' }" v-if="(productValue &&
					JSON.stringify(productValue)!='{}' && attr.productAttr && attr.productAttr.length !=0 
					&& storeInfo.stock > 0 && storeInfo.isShow) || isShowFooterBtnType">
						<form @submit="joinCart" report-submit='true' v-if="!isShengDanOK">
							<button class='joinCart bnts' form-type="submit">加入购物袋</button>
						</form>
						<form @submit="goBuy" report-submit='true'>
							<button class='buy bnts' form-type="submit" :style="{width: isShengDanOK ? '360rpx' : '210rpx' }">立即购买</button>
						</form>
					</view>
					<view class='bnt acea-row' :style="{justifyContent: 'center'}" v-else>
						<button class='buy bnts' :style="{width: '360rpx','background': '#777' }">商品已售罄</button>
					</view>
				</block>
				<block v-else>
					<view class='bnt acea-row' :style="{justifyContent: isShengDanOK ? 'center' : '' }" v-if="attr.cartAttr&&(productValue &&
					JSON.stringify(productValue)!='{}' && attr.productAttr && attr.productAttr.length !=0 
					&& storeInfo.stock > 0 && storeInfo.isShow) || isShowFooterBtnType">
						<form @submit="joinCart" report-submit='true' v-if="!isShengDanOK">
							<button class='joinCart bnts' form-type="submit">加入购物袋</button>
						</form>
						<form @submit="goBuy" report-submit='true'>
							<button class='buy bnts' form-type="submit" :style="{width: isShengDanOK ? '360rpx' : '210rpx' }">立即购买</button>
						</form>
					</view>
					<block v-else>
						<view class='bnt acea-row' :style="{justifyContent: 'center'}" v-if="attr.cartAttr">
							<button class='buy bnts' :style="{width: '360rpx','background': '#777' }">商品已售罄</button>
						</view>
					</block>
				</block>
				
				
			</view>
		</view>
		<view class="mask" @touchmove.prevent :hidden="attr.cartAttr == false" @click="closeAttr" @touchmove.stop.prevent=""></view>
		
		
	</view>
</template>

<script>
	let app = getApp();
	import {
		getCartCounts,
		getResetCart,
	} from '@/api/order.js';
	import {
		collectAdd,
		collectDel,
		postCartAdd,
	} from '@/api/store.js';
	import {
		mapGetters
	} from "vuex";
	import downLoadImg from '@/components/downLoadImg/downLoadImg.vue';
	export default {
		name: "productWindowNew",
		computed: mapGetters(['isLogin']),
		components: {
			downLoadImg
		},
		props: {
			storeData: {
				type: String,
				default: "{}"
			},
			systemType:{
				type:Boolean,
				default:false
			}
		},
		data(){
			return {
				iScart: false,//是否是购物车页面
				sceneType: 0,//购买弹框的场景  0:选购按钮（tabBar页面）1:选购按钮（普通页面） 2:购买按钮常显（普通页面）
				attr: {
					cartAttr: false,
					productAttr: [],
					productNewAttr:[],
					productSelect: {}
				},
				storeInfo: {}, //商品详情
				animated: false, //购物袋动画
				CartCount: 0,
				productValue: {}, //系统属性
				attrTxt: '请选择', //属性页面提示
				attrValue: '',
				isShowFooterBtn: false,
				isShowFooterBtnType: true,
				isOpen: false, //是否打开属性组件,
				
				isShengDanOK: false,
				cart_num: "1",
				
				cartId:"",//购物车id
				pageReady:false,
				indexItem:0,
				bottomLift:app.globalData.bottomLift,
				appletType:uni.getStorageSync("appletType")
			}
		},
		watch: {
			storeData(newValue, oldValue) {
				var that = this;
				var newData = JSON.parse(newValue)
				that.$set(that.attr, 'productAttr', newData.productAttr);
				
				that.$set(that, 'productValue', newData.productValues);
				that.$set(that, 'storeInfo', newData.storeInfo);
				that.$set(that, 'isShowFooterBtnType', false);
				if (that.isLogin) {
					that.getCartCount();
				};
				var aa = Object.assign({},that.productValue)
				console.log(newData.productValues,"productValues")
				var arry =[{attrName:'颜色',attrValue:[]},{attrName:'尺寸',attrValue:[]}]
				for(let key of newData.productValues){
					var arr = key.suk.split(",")
					if (arr.length==1){  // 只有尺码
						arry[1].attrValue.push({attr:arr[0],value:key})
					}
					if (arr.length==2){  // 有颜色和尺码
						arry[0].attrValue=[{attr:arr[0]}]
						arry[1].attrValue.push({attr:arr[1],value:key})
					}
				}
				if (arry[0].attrValue.length==0){
					arry.shift()
				}
				that.$set(that.attr, 'productNewAttr', arry);
				console.log(that.attr,"productValue11")
				that.DefaultSelect();
				that.$set(that, 'isOpen', true);
				that.pageReady = true
				console.log(that.attr,"attrattrattrattr")
			},
		},
		methods: {
			/**
			 * 获取购物袋数量
			 * @param boolean 是否展示购物袋动画和重置属性
			 */
			getCartCount: function(isAnima) {
				let that = this;
				if (that.isLogin) {
					getCartCounts().then(res => {
						that.CartCount = res.data.count;
						//加入购物袋后重置属性
						if (isAnima) {
							that.animated = true;
							setTimeout(function() {
								that.animated = false;
							}, 500);
						}
					});
				}
			},
			// 默认选中属性
			DefaultSelect: function() {
				let productNewAttr = this.attr.productNewAttr;
				let value = [];
				let value1 = [];
				let dataValue = {};
				var aa = Object.assign({},this.productValue)
				
				for (let key of this.productValue) {
					if (key.stock > 0) {
						console.info(key,"suk")
						value1 = this.attr.productAttr.length ? key.suk.split(",") : [];
						break;
					}
				}
				for (let i = 0; i < this.attr.productAttr.length; i++) {
					this.$set(this.attr.productAttr[i], "index", value1);
				}
				if(productNewAttr.length>1){
					for (let item of productNewAttr[1].attrValue) {
						if (item.value.stock > 0) {
							value = item.value
							this.indexItem = item.value.id
							break;
						}
					}
				}else{
					for (let item of productNewAttr[0].attrValue) {
						if (item.value.stock > 0) {
							value = item.value
							this.indexItem = item.value.id
							break;
						}
					}
				}
				
				console.info(this.indexItem,value)
				//sort();排序函数:数字-英文-汉字；
				let productSelect = value;
				if (productSelect && this.attr.productAttr.length) {
					this.$set(this.attr.productSelect,"storeName",this.storeInfo.storeName);
					this.$set(this.attr.productSelect, "image", productSelect.image);
					this.$set(this.attr.productSelect, "price", productSelect.price);
					this.$set(this.attr.productSelect, "taxAndSecondPrice", productSelect.taxAndSecondPrice);
					this.$set(this.attr.productSelect, "stock", productSelect.stock);
					this.$set(this.attr.productSelect, "unique", productSelect.id);
					this.$set(this.attr.productSelect, "cart_num", 1);
					this.$set(this, "attrValue", value1.join(","));
					this.$set(this, "attrTxt", "已选择");
				} else if (!productSelect && productAttr.length) {
					this.$set(this.attr.productSelect,"storeName",this.storeInfo.storeName);
					this.$set(this.attr.productSelect, "image", this.storeInfo.image);
					this.$set(this.attr.productSelect, "price", this.storeInfo.price);
					this.$set(this.attr.productSelect, "taxAndSecondPrice", this.storeInfo.taxAndSecondPrice);
					this.$set(this.attr.productSelect, "stock", 0);
					this.$set(this.attr.productSelect, "unique", this.storeInfo.id);
					this.$set(this.attr.productSelect, "cart_num", 1);
					this.$set(this, "attrValue", "");
					this.$set(this, "attrTxt", "请选择");
				} else if (!productSelect && !productAttr.length) {
					this.$set(this.attr.productSelect,"storeName",this.storeInfo.storeName);
					this.$set(this.attr.productSelect, "image", this.storeInfo.image);
					this.$set(this.attr.productSelect, "price", this.storeInfo.price);
					this.$set(this.attr.productSelect, "taxAndSecondPrice", this.storeInfo.taxAndSecondPrice);
					this.$set(this.attr.productSelect, "stock", this.storeInfo.stock);
					this.$set(this.attr.productSelect,"unique",this.storeInfo.id || "");
					this.$set(this.attr.productSelect, "cart_num", 1);
					this.$set(this, "attrValue", "");
					this.$set(this, "attrTxt", "请选择");
				}
				this.$emit("update:attrValue", this.attrValue);
				this.$emit("update:attrTxt", this.attrTxt);
			},
			// 关闭购物框
			closeAttr: function() {
				this.$emit("cartAttr",false)
				this.$set(this.attr, 'cartAttr', false);
				this.$set(this, 'isOpen', false);
				console.log(this.sceneType,"sceneType111111111111")
				if(this.sceneType == 0){
					uni.showTabBar()
					this.isShowFooterBtn = false
				}else if(this.sceneType == 1){
					this.isShowFooterBtn = false
				}
			},
			// 收藏商品
			setCollect: function() {
				let that = this;
				if (that.isLogin === false) {
					this.closeAttr()
					uni.navigateTo({
						url: "/pages/login/login"
					})
				} else {
					if (that.storeInfo.userCollect) {
						collectDel(that.storeInfo.id).then(res => {
							that.$set(that.storeInfo, 'userCollect', !that.storeInfo.userCollect);
						})
					} else {
						collectAdd(that.storeInfo.id).then(res => {
							that.$set(that.storeInfo, 'userCollect', !that.storeInfo.userCollect);
						})
					}
				}
			},
			//跳转购物袋页面
			goCartPage(){
				if (this.isLogin === false) {
					this.closeAttr()
					uni.navigateTo({
						url: "/pages/login/login"
					})
				} else {
					uni.navigateTo({
						url: "/pages/order_addcart_page/order_addcart_page"
					})
				}
			},
			// 判断规格
			checkStock(v,index){
				console.log(this.productValue,"culVal111111")
				let that = this;
				let value = that.getCheckedValue();
				let culVal = [];
				
				// 如果有3组sku组合，显示全部，不做隐藏
				if(that.attr.productAttr.length>2){
					return false;
				}
				
				if(that.attr.productAttr.length==1){
					culVal.push(v.attr);
				}
				
				if(that.attr.productAttr.length==2){
					// if(index==0) return;
					culVal.push(value[0]);
					culVal.push(v.attr);
				}
				console.log(that.productValue,culVal,"culVal222222")
				let val = culVal.join(",");
				let product = that.productValue[val] || null;
				let stock = product && product.stock ? product.stock:0;
				console.log(stock,"stock")
				return stock<=0 ? false : true;
			},
			//获取被选中属性；
			getCheckedValue: function() {
				let productAttr = this.attr.productAttr;
				let value = [];
				for (let i = 0; i < productAttr.length; i++) {
					for (let j = 0; j < productAttr[i].attrValues.length; j++) {
						if (productAttr[i].index === productAttr[i].attrValues[j]) {
							value.push(productAttr[i].attrValues[j]);
						}
					}
				}
				return value;
			},
		    // 切换属性
			tapAttr: function(indexw, indexn,item,itemn) {
				let that = this;
				that.$emit("attrVal", {
					indexw: indexw,
					indexn: indexn
				});
				this.indexItem = itemn.value.id
				
				var add = JSON.parse(itemn.value.attrValue)
				var value1 = []
				for (let key in add){
					value1.push(add[key])
				}
				// this.$set(this.attr.productAttr[indexw], 'index', this.attr.productAttr[indexw].attrValues[indexn]);
				let value = value1.join(",");
				
				that.ChangeAttr(value,itemn);
			},
			/**
			 * 属性变动赋值
			 * 
			 */
			ChangeAttr: function(res,itemn) {
				// console.info(this.attr.productNewAttr,res,itemn,"属性变动赋值")
				let productSelect = itemn.value;
				if (productSelect && productSelect.stock > 0) {
					this.$set(this.attr.productSelect, "image", productSelect.image);
					this.$set(this.attr.productSelect, "price", productSelect.price);
					this.$set(this.attr.productSelect, "taxAndSecondPrice", productSelect.taxAndSecondPrice);
					this.$set(this.attr.productSelect, "stock", productSelect.stock);
					this.$set(this.attr.productSelect, "unique", productSelect.id);
					this.$set(this.attr.productSelect, "cart_num", 1);
					this.$set(this, "attrValue", res);
					this.$set(this, "attrTxt", "已选择");
				} else {
					this.$set(this.attr.productSelect, "image", this.storeInfo.image);
					this.$set(this.attr.productSelect, "price", this.storeInfo.price);
					this.$set(this.attr.productSelect, "taxAndSecondPrice", this.storeInfo.taxAndSecondPrice);
					this.$set(this.attr.productSelect, "stock", 0);
					this.$set(this.attr.productSelect, "unique", this.storeInfo.id);
					this.$set(this.attr.productSelect, "cart_num", 1);
					this.$set(this, "attrValue", "");
					this.$set(this, "attrTxt", "请选择");
				}
				this.$emit("update:attrValue", this.attrValue);
				this.$emit("update:attrTxt", this.attrTxt);
			},
			//购物车数量加减
			ChangeCartNum: function(changeValue) {
				console.info(changeValue)
				//changeValue:是否 加|减
				//获取当前变动属性
				let productSelect = this.attr.productSelect;
				//如果没有属性,赋值给商品默认库存
				if (productSelect === undefined && !this.attr.productAttr.length)
					productSelect = this.attr.productSelect;
				//无属性值即库存为0；不存在加减；
				if (productSelect === undefined) return;
				let stock = productSelect.stock || 0;
				let num = this.attr.productSelect;
				if (changeValue) {
					num.cart_num++;
					if (num.cart_num > stock) {
						this.$set(this.attr.productSelect, "cart_num", stock);
						this.$set(this, "cart_num", stock);
						console.log(this.attr.productSelect)
					}else {
						return false
					}
				} else {
					num.cart_num--;
					if (num.cart_num < 1) {
						this.$set(this.attr.productSelect, "cart_num", 1);
						this.$set(this, "cart_num", 1);
					}else {
						return false
					}
				}
			},
			// 购物袋手动输入数量
			bindCode: function (e) {
				console.log(e,"购物袋手动输入数量")
				this.$set(this.attr.productSelect, 'cart_num', e.detail.value);
			},
			// 加入购物袋
			joinCart: function(e) {
				//是否登录
				if (this.isLogin === false) {
					this.closeAttr()
					uni.navigateTo({
						url: "/pages/login/login"
					})
				} else {
					this.goCat();
				}
			},
			/**
			 * 立即购买
			 */
			goBuy: function(e) {
				if (this.isLogin === false) {
					this.closeAttr()
					uni.navigateTo({
						url: "/pages/login/login"
					})
				} else {
					this.goCat(true);
				}
			},
			/*
			 * 购买and加入购物车
			 */
			goCat: function(news) {
				
				let that = this,
					productSelect = this.attr.productSelect;
				//打开属性
				if(!that.attr.cartAttr){
					this.$emit("cartAttr",true)
					return that.attr.cartAttr = true
				}
				//如果有属性,没有选择,提示用户选择
				if (
					that.attr.productAttr.length &&
					productSelect === undefined &&
					that.isOpen === true
				)
					return that.$util.Tips({
						title: "产品库存不足，请选择其它"
					});
			
				let q = {
					productId: Number(that.storeInfo.id),
					cartNum: Number(that.attr.productSelect.cart_num),
					isNew: news === undefined ? false : true,
					productAttrUnique: that.attr.productSelect !== undefined ? that.attr.productSelect.unique : that.storeInfo.id
				};
				postCartAdd(q).then(function(res) {
						that.isOpen = false;
						if(that.sceneType == 2){
							that.isShowFooterBtn = true;
						}else {
							that.isShowFooterBtn = false;
						}
						that.attr.cartAttr = false;
						if (news) {
							uni.navigateTo({
								url: '/pages/order_confirm/index?new=true&cartId=' + res.data.cartId
							});
						} else {
							that.$util.Tips({
								title: "添加购物袋成功",
								success: () => {
									that.getCartCount(true);
									console.log(that.sceneType,"sceneType2222222222222")
									if(that.sceneType == 0){
										uni.showTabBar()
									}
								}
							});
						}
					})
					.catch(res => {
						that.isOpen = false;
						return that.$util.Tips({
							title: res
						});
					});
			},
			// 修改购物袋
			reGoCat: function(id) {
				
				var productNewAttr = this.attr.productNewAttr
				console.info(productNewAttr,11)
				var data = {}
				if(productNewAttr.length>1){
					for (let item of productNewAttr[1].attrValue) {
						if (item.value.id==this.indexItem) {
							data = item.value
							break;
						}
					}
				}else{
					for (let item of productNewAttr[0].attrValue) {
						if (item.value.id==this.indexItem) {
							data = item.value
							break;
						}
					}
				}
				console.info(data,22)
				let that = this,
					productSelect = data;
				console.log(this.attrValue,productSelect,that.productValue,"修改购物袋");
				//如果有属性,没有选择,提示用户选择
				if (
					that.attr.productAttr.length &&
					productSelect === undefined
				)
					return that.$util.Tips({
						title: "产品库存不足，请选择其它"
					});
					
				let q = {
					id: that.cartId,
					productId: Number(that.storeInfo.id),
					num: Number(that.attr.productSelect.cart_num),
					unique: that.attr.productSelect !== undefined ? that.attr.productSelect.unique : that.storeInfo.id
				};
				getResetCart(q).then(function(res) {
					that.attr.cartAttr = false;
					that.$util.Tips({
						title: "添加购物袋成功",
						success: () => {
							that.$emit('goCat');
						}
					});
				})
				.catch(res => {
					return that.$util.Tips({
						title: res.msg
					});
				});
			},
			showWxFun(){
				this.$emit('showWx')
			}
		}
	}
</script>

<style scoped lang="scss">
	.product-window {
		position: fixed;
		bottom: 0;
		width: 100%;
		left: 0;
		background-color: #fff;
		z-index: 77;
		border-radius: 16rpx 16rpx 0 0;
		padding-bottom: 140rpx;
		transform: translate3d(0, 100%, 0);
		transition: all .3s cubic-bezier(.25, .5, .5, .9);
	}

	.product-window.on {
		transform: translate3d(0, 0, 0);
	}

	.product-window .textpic {
		padding: 0 130rpx 0 30rpx;
		margin-top: 29rpx;
		position: relative;
	}

	.product-window .textpic .pictrue {
		width: 150rpx;
		height: 150rpx;
	}

	.product-window .textpic .pictrue image {
		width: 100%;
		height: 100%;
		border-radius: 10rpx;
	}

	.product-window .textpic .text {
		width: 410rpx;
		font-size: 32rpx;
		color: #202020;
	}

	.product-window .textpic .text .money {
		font-size: 24rpx;
		margin-top: 40rpx;
	}

	.product-window .textpic .text .money .num {
		font-size: 36rpx;
	}

	.product-window .textpic .text .money .stock {
		color: #999;
		margin-left: 18rpx;
	}

	.product-window .textpic .iconfont {
		position: absolute;
		right: 30rpx;
		top: -5rpx;
		font-size: 35rpx;
		color: #8a8a8a;
	}

	.product-window .productWinList {
		max-height: 395rpx;
		overflow: auto;
		margin-top: 36rpx;
	}

	.product-window .productWinList .item~.item {
		margin-top: 36rpx;
	}

	.product-window .productWinList .item .title {
		font-size: 30rpx;
		color: #999;
		padding: 0 30rpx;
	}

	.product-window .productWinList .item .listn {
		padding: 0 30rpx 0 16rpx;
	}

	.product-window .productWinList .item .listn .itemn {
		border: 1px solid #bbb;
		font-size: 26rpx;
		color: #282828;
		padding: 7rpx 33rpx;
		border-radius: 6rpx;
		margin: 14rpx 0 0 14rpx;
	}

	.product-window .productWinList .item .listn .itemn.on {
		color: #fff;
		background-color: #222;
		border-color: #222;
	}

	.product-window .cart {
		margin-top: 36rpx;
		padding: 0 30rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.product-window .cart .title {
		font-size: 30rpx;
		color: #999;
	}

	.product-window .cart .carnum {
		height: 54rpx;
	}

	.product-window .cart .carnum view {
		border: 1px solid #a4a4a4;
		width: 84rpx;
		text-align: center;
		height: 100%;
		line-height: 54rpx;
		color: #a4a4a4;
		font-size: 45rpx;
	}

	.product-window .cart .carnum .reduce {
		border-right: 0;
		border-radius: 6rpx 0 0 6rpx;
		line-height: 40rpx;
	}

	.product-window .cart .carnum .reduce.on {
		border-color: #e3e3e3;
		color: #dedede;
	}

	.product-window .cart .carnum .plus {
		border-left: 0;
		border-radius: 0 6rpx 6rpx 0;
		line-height: 40rpx;
	}

	.product-window .cart .carnum .plus.on {
		border-color: #e3e3e3;
		color: #dedede;
	}

	.product-window .cart .carnum .num {
		color: #282828;
		font-size: 28rpx;
	}
	.product-window .cart .carnum .reduce .iconfont,.product-window .cart .carnum .plus .iconfont{
		font-size: 24rpx;
	}
	.product-window .joinBnt{font-size: 30rpx;width: 620rpx;height: 86rpx;border-radius: 50rpx;text-align: center;line-height: 86rpx;color: #fff;margin: 21rpx auto 0 auto;}
	.product-window .joinBnt.on{background-color:#bbb;color:#fff;}
	
	
	.product-con .footer {
		padding: 0 20rpx 0 30rpx;
		position: fixed;
		bottom: 0rpx;
		left: 750rpx;
		width: 100%;
		box-sizing: border-box;
		height: 100rpx;
		background-color: #fff;
		z-index: 277;
		border-top: 1rpx solid #f0f0f0;
	}
	
	.product-con .footer .item {
		font-size: 18rpx;
		color: #666;
	}
	
	.product-con .footer .item .iconfont {
		text-align: center;
		font-size: 40rpx;
		position: relative;
	}
	
	.product-con .footer .item .iconfont.iconshoucang-tianchong {
		color: #222;
		font-size: 40rpx;
		position: relative;
	}
	
	.product-con .footer .item .iconfont.icongouwudai .num {
		color: #fff;
		position: absolute;
		font-size: 18rpx;
		padding: 2rpx 8rpx 3rpx;
		border-radius: 200rpx;
		top: -10rpx;
		right: -10rpx;
		line-height: 100%;
		background-color: #af8a40;
	}
	
	.product-con .footer .bnt {
		width: 444rpx;
		height: 70rpx;
	}
	
	.product-con .footer .bnt .bnts {
		width: 210rpx;
		height: 70rpx;
		text-align: center;
		line-height: 70rpx;
		color: #fff;
		font-size: 28rpx;
	}
	
	.product-con .footer .bnt .joinCart {
		border: 2rpx solid #222222;
		color: rgba(34, 34, 34, 1);
		box-sizing: border-box;
	}
	
	.product-con .footer .bnt .buy {
		background-color: #222;
		margin-left: 10px;
	}
	
	.downLoadImg{
		display: block;
		font-size: 18rpx;
		color: #666;
		.iconfont {
			font-size: 40rpx;
			display: block;
		}
	}
	.bottomLift{
		height: 164rpx!important;
	}
</style>